import React,{ Component,Fragment } from 'react';
import {Input,Button,Icon,message} from 'antd';

import messageMC from '../static/css/message.module.css';

class SendMessage extends Component{
  constructor(props){
    super(props);
    this.state = {
      inputValue:''
    }
  }
  render(){
    return(
      <Fragment>
        <Input value={this.state.inputValue} placeholder="请输入你要发送的内容" style={{width:'76%',verticalAlign:'middle',border:'0',height:'40px'}} onChange={this.textChange.bind(this)} />
        <Button style={{
          width:'40px',
          height:'40px',
          verticalAlign:'middle',
          backgroundColor:'#3598db',
          lineHeight:'40px',
          textAlign:'center',
          padding:0,
          borderRadius:'50%',
          marginLeft:'30px',
          disabled:this.props.disabled
          }} onClick={this.send.bind(this)} disabled={this.props.disabled}>
          <Icon type="edit" theme="filled" style={{color:'#fff',fontSize:'16px'}}></Icon>
        </Button>
      </Fragment>
    )
  }
  //发送确定
  send(e){
    let msg = this.state.inputValue;
    if(msg === ''){
      message.info('请输入内容');
      return false;
    }
    this.props.sendSure(msg);
    this.setState({
      inputValue:''
    });
  }
  //输入文字
  textChange(e){
    let inputValue = e.target.value;
    //过滤字符
    //转实体
    this.setState({
      inputValue:inputValue
    });

  }
}

export default SendMessage;